<template>
  <view class="container">
    <!-- 表单区域 -->
    <view class="form-section">
      <!-- 设备信息 -->
      <view class="form-group">
        <view class="form-title">设备信息</view>
        <view class="form-item">
          <text class="label">设备名称</text>
          <text class="value">{{ sbInfo.sbmc }}</text>
        </view>
        <view class="form-item">
          <text class="label">设备编号</text>
          <text class="value">{{ sbInfo.sbbh }}</text>
        </view>
        <view class="form-item">
          <text class="label">所在位置</text>
          <text class="value">{{ sbInfo.azdd }}</text>
        </view>
        <view class="form-item">
          <text class="label">点检日期
            <text style="font-size: 26rpx;color: red" v-if="pageType==0">*</text>
          </text>

<!--          <up-datetime-picker :disabled="pageType==1||pageType==2"-->
<!--                              hasInput-->
<!--                              v-model="spotCheckDate"-->
<!--                              mode="date"-->
<!--                              :maxDate="pickMaxDate"-->
<!--          >-->
<!--          </up-datetime-picker>-->

          <picker
              mode="date"
              :disabled="pageType==1||pageType==2"
              :value="spotCheckDate"
              :start="pickMinDate"
              :end="pickMaxDate"
              @change="datePickerChange"
          >
            <view class="date-picker-text">
              <text style="font-size: 26rpx;">{{ spotCheckDate }}</text>
              <text class="picker-arrow" v-if="pageType==0">></text>
            </view>
          </picker>

        </view>
        <view class="form-item">
          <text class="label">点检状态</text>
          <text class="value">{{ currentStatus }}</text>
        </view>
      </view>

      <!-- 点检项目列表 -->
      <view class="form-group">
        <view class="form-header">
          <view class="form-title">点检项目</view>
          <view class="quick-action" :class="{ 'is-marked': isAllMarked }" @tap="toggleMarkAll" v-if="!isDisabled">
            <text class="action-text">{{ isAllMarked ? '一键取消' : '一键合格' }}</text>
          </view>
        </view>
        <view style="display: flex;align-items: center;justify-content: space-around" v-if="pageType!=0">
          <picker @change="spotcheckstructureChange" :value="spotcheckstructureIndex" :range="spotcheckstructureList"
                  range-key="id">
            <view class="custom-picker">
              <view class="custom-picker-text">
                {{ spotcheckstructureSelected || '点检结构' }}
              </view>
              <view class="arrow-icon"></view>
            </view>
          </picker>

          <picker @change="spotcheckpartChange" :value="spotcheckpartIndex" :range="spotcheckpartList" range-key="id">
            <view class="custom-picker">
              <view class="custom-picker-text">
                {{ spotcheckpartSelected || '点检部位' }}
              </view>
              <view class="arrow-icon"></view>
            </view>
          </picker>

          <picker @change="whethernormalChange" :value="whethernormalIndex" :range="whethernormalList" range-key="value">
            <view class="custom-picker">
              <view class="custom-picker-text">
                {{ whethernormalSelected || '点检结果' }}
              </view>
              <view class="arrow-icon"></view>
            </view>
          </picker>
        </view>

        <view class="check-list">
          <view v-for="(value,key,index) in checkDetailTwoCycleList" :key="index">
            <view >
              <text style="font-weight: bold;"> {{key}}</text>
                <view class="check-item" v-for="(item) in value" :key="item.id" slot="body">
                  <view class="check-header">
                    <text class="label">点检部位</text>
                    <text class="check-name">{{ item.spotcheckpart }}</text>
                    <text class="check-required" v-if="item.required">*</text>
                  </view>
                  <view class="check-header">
                    <text class="label">点检内容</text>
                    <text class="check-name">{{ item.spotcheckcontent }}</text>
                    <text class="check-required" v-if="item.required">*</text>
                  </view>

                  <view class="check-options">
                    <view :class="'option ' + (item.whethernormal === '1' ? 'active' : '')" data-value="良好"
                          @tap="onOptionSelect(key,item.id,'1')">良好
                    </view>
                    <view :class="'option ' + (item.whethernormal === '2' ? 'active' : '')" data-value="有问题"
                          @tap="onOptionSelect(key,item.id,'2')">有问题
                    </view>
                    <view :class="'option ' + (item.whethernormal === '3' ? 'active' : '')" data-value="当场处理"
                          @tap="onOptionSelect(key,item.id,'3')">当场处理
                    </view>
                    <view :class="'option ' + (item.whethernormal === '4' ? 'active' : '')" data-value="维修"
                          @tap="onOptionSelect(key,item.id,'4')">维修
                    </view>
                    <view :class="'option ' + (item.whethernormal === '5' ? 'active' : '')" data-value="故障"
                          @tap="onOptionSelect(key,item.id,'5')">故障
                    </view>
                    <view :class="'option ' + (item.whethernormal === '6' ? 'active' : '')" data-value="计划处理"
                          @tap="onOptionSelect(key,item.id,'6')">计划处理
                    </view>
                  </view>

                  <!-- 异常情况下显示描述输入框和照片上传 -->
                  <view class="abnormal-content"
                        v-if="item.whethernormal !== '1' && item.whethernormal !== null  && item.whethernormal !==''">
                    <textarea class="abnormal-desc" :disabled="isDisabled" placeholder="请填写异常原因"
                              v-model="item.abnormalreason"></textarea>
                    <textarea class="abnormal-desc" :disabled="isDisabled" placeholder="请填写异常描述"
                              v-model="item.abnormaldescription"></textarea>
                    <textarea class="abnormal-desc" :disabled="isDisabled" placeholder="请填写异常类型"
                              v-model="item.abnormaltype"></textarea>
                    <!-- 添加照片上传区域 -->
                    <!--              <view class="upload-images">
                                    <view class="image-list">
                                      <view class="image-item" v-for="(img, imgIndex) in (item.images || [])"
                                            :key="imgIndex">
                                        <image :src="img" mode="aspectFill"
                                               @tap="previewImage(item.images, imgIndex)" />
                                        <view class="delete-btn" @tap.stop="deleteImage(item.id, imgIndex)">×</view>
                                      </view>
                                      <view class="upload-btn" @tap="chooseImage(item.id)"
                                            v-if="!item.images || item.images.length < 3">
                                        <text class="upload-icon">+</text>
                                        <text class="upload-text">上传照片</text>
                                        <text
                                            class="upload-desc">{{ item.images ? (3 - item.images.length) : 3 }}张</text>
                                      </view>
                                    </view>
                                  </view>-->
                  </view>
                </view>
            </view>
          </view>
        </view>
      </view>

      <!--      <view class="form-group">
              <view class="form-title">现场照片</view>
              <view class="upload-section">
                <view class="image-list">
                  <view class="image-item" v-for="(item, index) in images" :key="index">
                    <image :src="item" mode="aspectFill" @tap="previewImage" :data-url="item"/>

                    <view class="delete-btn" @tap.stop.prevent="deleteImage" :data-index="index">×</view>
                  </view>
                  <view class="upload-btn" @tap="chooseImage" v-if="images.length < 4">
                    <text class="plus">+</text>
                    <text class="upload-text">上传照片</text>
                  </view>
                </view>
              </view>
            </view>

            <view class="form-group">
              <view class="form-title">备注信息</view>
              <textarea class="remarks" placeholder="请输入备注信息（选填）" :value="remarks"
                        @input="onRemarksInput"></textarea>
            </view>-->
    </view>

    <!-- 提交按钮 -->
    <view class="footer-submit">
      <button v-if="submitFeedbackButtonVisitable" :disabled="isDoubleClickDisabled" @tap="submitFeedback">提交反馈结果</button>
      <button class="revoke" v-if="revokeFeedbackButtonVisitable" :disabled="isDoubleClickDisabled"  @tap="revokeFeedback">撤销反馈结果</button>
      <button v-if="bzzConfirmButtonVisitable" :disabled="isDoubleClickDisabled"  @tap="submitBzzConfirm">班组长确认</button>
      <button class="revoke" v-if="bzzRevokeConfirmButtonVisitable" :disabled="isDoubleClickDisabled"  @tap="revokeBzzConfirm">班组长撤销确认</button>
      <button v-if="sbyConfirmButtonVisitable" :disabled="isDoubleClickDisabled"  @tap="submitSbyConfirm">设备员审核</button>
      <button class="revoke" v-if="sbyRevokeConfirmButtonVisitable" :disabled="isDoubleClickDisabled"  @tap="revokeSbyConfirm">设备员撤销审核</button>
    </view>
  </view>
</template>

<script>
import dayjs from "dayjs/esm/index";
import Login from "../../../pages/login/login.vue";

export default {
  data() {
    return {
      currentStatus:"",
      isDisabled: true, //表单填写可读控制
      revokeFeedbackButtonVisitable: false,//撤销反馈按钮
      submitFeedbackButtonVisitable: false,//提交反馈按钮
      bzzConfirmButtonVisitable: false,//bzz确认按钮
      bzzRevokeConfirmButtonVisitable: false,//bzz撤销确认按钮
      sbyConfirmButtonVisitable: false,//sby确认按钮
      sbyRevokeConfirmButtonVisitable: false,//sby确认按钮
      isBzzConfirmed: "0",
      isSbyConfirmed: "0",
      isSpotChecked: "0",
      spotCheckBy: "",
      bzzConfirmBy: "",
      sbyConfirmBy: "",
      userid: "",
      sbid: "",
      pageType: 0,// 0-点检员 1-班组长 2-设备员
      sbInfo: {
        sbmc: "",
        sbbh: "",
        azdd: ""
      },
      spotCheckDate: "",
      pickMaxDate: new Date().getTime(),
      pickMinDate: new Date().getTime(),
      spotCheckDetailList: [],
      checkDetailTwoCycleList: [],
      checkPlanId: "",
      submitData: [],
      submitYear: "",
      submitMonth: "",
      submitStatus: "",
      submitWeek: "",
      images: [],
      remarks: '',
      isAllMarked: false, // 添加 isAllMarked 字段
      isDoubleClickDisabled: false,
      spotcheckstructureIndex:0,
      spotcheckpartIndex:0,
      whethernormalIndex:0,
      spotcheckstructureList:[],
      spotcheckpartList:[],
      whethernormalList:[
        {id:"",value:""},
        {id:1,value:"良好"},
        {id:2,value:"有问题"},
        {id:3,value:"当场处理"},
        {id:4,value:"维修"},
        {id:5,value:"故障"},
        {id:6,value:"计划处理"}
      ],
      spotcheckstructureSelected:"",
      spotcheckpartSelected:"",
      whethernormalSelected:"",
      whethernormalSelectedKey:""
    };
  },
  onLoad: function (option) {
    this.userid = this.$commonUnits.getUserId();
    this.sbid = option.id;
    this.pageType = option.type;
    //如果是从班组长/设备员点进来的，要赋值点检时间，而且不允许修改当前的页面
    if(this.pageType == 1 || this.pageType == 2){
      this.spotCheckDate = option.checkdate;
    }
    this.getEquipmentInfo();
    this.setDatetimePickerRange();
    //点检员页面
    if(this.pageType == 0){
      this.spotCheckDate = dayjs().format("YYYY-MM-DD");
      this.getSpotDetailList();
    }
  },
  methods: {
    spotcheckstructureChange(e){
      this.spotcheckstructureIndex = e.detail.value; // 选中的索引
      this.spotcheckstructureSelected = this.spotcheckstructureList[this.spotcheckstructureIndex].id; // 选中的值
      this.getSpotDetailList();
      // console.log(this.spotcheckstructureSelected)
    },
    spotcheckpartChange(e){
      this.spotcheckpartIndex = e.detail.value; // 选中的索引
      this.spotcheckpartSelected = this.spotcheckpartList[this.spotcheckpartIndex].id; // 选中的值
      this.getSpotDetailList();
      // console.log(this.spotcheckpartSelected)
    },
    whethernormalChange(e){
      this.whethernormalIndex = e.detail.value; // 选中的索引
      this.whethernormalSelected = this.whethernormalList[this.whethernormalIndex].value; // 选中的值
      this.whethernormalSelectedKey = this.whethernormalList[this.whethernormalIndex].id; // 选中的值
      this.getSpotDetailList();
      // console.log(this.whethernormalSelectedKey)
    },
    // 获取设备基本信息
    getEquipmentInfo() {
      this.$commonUnits.postRequest('sbby.zcglsbtzbiz.getZcglSbtzById.mobile', {id: this.sbid}).then(item => {
        this.sbInfo = item.res[0];
      })
    },

    //日期选择变化
    datePickerChange(item){
      this.spotCheckDate = item.detail.value;
    },

    // 设置点检时间可选范围(7天以内
    setDatetimePickerRange() {
      let minDate = new Date();
      minDate.setDate(minDate.getDate() - 7);
      this.pickMaxDate = new Date().getTime();
      this.pickMinDate = minDate.getTime();
    },

    // 切换标记状态
    toggleMarkAll() {
      if (!this.isAllMarked) {
        this.markAllNormal();
      } else {
        this.unmarkAll();
      }
    },

    // 一键合格
    markAllNormal() {
      uni.showModal({
        title: '确认提示',
        content: '确定将所有检查项标记为正常吗？',
        success: (res) => {
          if (res.confirm) {
            for (const key in this.checkDetailTwoCycleList) {
              this.checkDetailTwoCycleList[key].forEach(item => {
                item.whethernormal = '1';
                item.abnormaldescription = '';
                item.abnormalreason = '';
                item.abnormaltype = '';
              })
            }
            // console.log('一键添加标记状态', this.checkDetailTwoCycleList);
            uni.showToast({
              title: '已全部标记为正常',
              icon: 'success'
            });
            this.isAllMarked = !this.isAllMarked;
          }
        }
      });
    },

    // 取消所有标记
    unmarkAll() {
      uni.showModal({
        title: '确认提示',
        content: '确定取消所有检查项的标记吗？',
        success: (res) => {
          if (res.confirm) {
            for (const key in this.checkDetailTwoCycleList) {
              this.checkDetailTwoCycleList[key].forEach(item => {
                item.whethernormal = '';
                item.abnormaldescription = '';
                item.abnormalreason = '';
                item.abnormaltype = '';
              })
            }
            // console.log('一键取消标记状态', this.checkDetailTwoCycleList);
            uni.showToast({
              title: '已取消所有标记',
              icon: 'success'
            });
            this.isAllMarked = !this.isAllMarked;
          }
        }
      });
    },

    // 获取点检详情列表
    getSpotDetailList() {
      this.$commonUnits.postRequest('sbby.spotcheckmobilebiz.getSbSpotCheckDetailList.mobile',
          {
            sbid: this.sbid,
            date: dayjs(this.spotCheckDate).format('YYYY-MM-DD'),
            spotcheckstructure: this.spotcheckstructureSelected,
            spotcheckpart: this.spotcheckpartSelected,
            whethernormal: this.whethernormalSelectedKey.toString()
          }).then(item => {
        this.spotCheckDetailList = item.res.list;
        if(item.res.list.length===0){
          this.checkDetailTwoCycleList=[];
        }else{
          this.checkPlanId = this.spotCheckDetailList[0].id;
          this.checkDetailTwoCycleList = this.$commonUnits.groupBy(this.spotCheckDetailList, 'spotcheckstructure');
        }
        this.spotcheckstructureList=[{id:'',value:''}];
        this.spotcheckpartList=[{id:'',value:''}];
        let spotcheckstructureSet = new Set();
        let spotcheckpartSet = new Set();
        this.spotCheckDetailList.forEach(item=>{
          if (!spotcheckstructureSet.has(item.spotcheckstructure)) {
            this.spotcheckstructureList.push({
              id: item.spotcheckstructure,
              value: item.spotcheckstructure
            });
            spotcheckstructureSet.add(item.spotcheckstructure);
          }

          if (!spotcheckpartSet.has(item.spotcheckpart)) {
            this.spotcheckpartList.push({
              id: item.spotcheckpart,
              value: item.spotcheckpart
            });
            spotcheckpartSet.add(item.spotcheckpart);
          }
        });

        this.isSpotChecked = item.res.isSpotChecked;
        this.isBzzConfirmed = item.res.isBzzConfirmed;
        this.isSbyConfirmed = item.res.isSbyConfirmed;
        this.spotCheckBy = item.res.spotCheckBy;
        this.bzzConfirmBy = item.res.bzzConfirmBy;
        this.sbyConfirmBy = item.res.sbyConfirmBy;
        // console.log('接口获取', this.checkDetailTwoCycleList);
        // TODO 撤销按键显示隐藏控制逻辑，需要向前兼容，登录时要缓存上数字照、签名地址，然后比较快照是否一致，一致就是可以撤销的（）
        // 点检员提交(权限 页面类型)
        if (this.isSpotChecked === "0" && this.$commonUnits.stringIsBlank(this.spotCheckBy)
            && this.pageType === "0" && this.$userPerssion.bzzPermission()) {
          this.isDisabled = false;
          this.submitFeedbackButtonVisitable = true;
          this.revokeFeedbackButtonVisitable = false;
          this.bzzConfirmButtonVisitable = false;
          this.bzzRevokeConfirmButtonVisitable = false;
          this.sbyConfirmButtonVisitable = false;
          this.sbyRevokeConfirmButtonVisitable = false;
        }
        // 点检员撤回（当前用户提交）
        if (this.isSpotChecked === "1" && this.isBzzConfirmed === "0"
            && this.spotCheckBy === this.userid && this.pageType === "0"
            && this.$userPerssion.bzzPermission()) {
          this.isDisabled = true;
          this.submitFeedbackButtonVisitable = false;
          this.revokeFeedbackButtonVisitable = true;
          this.bzzConfirmButtonVisitable = false;
          this.bzzRevokeConfirmButtonVisitable = false;
          this.sbyConfirmButtonVisitable = false;
          this.sbyRevokeConfirmButtonVisitable = false;
        }
        // 班组长确认
        if (this.isSpotChecked === "1" && this.isBzzConfirmed === "0"
            && this.pageType === "1" && this.$userPerssion.bzzPermission()) {
          this.isDisabled = true;
          this.submitFeedbackButtonVisitable = false;
          this.revokeFeedbackButtonVisitable = false;
          this.bzzConfirmButtonVisitable = true;
          this.bzzRevokeConfirmButtonVisitable = false;
          this.sbyConfirmButtonVisitable = false;
          this.sbyRevokeConfirmButtonVisitable = false;
        }
        // 班组长撤销确认
        if (this.isBzzConfirmed === "1" && this.bzzConfirmBy === this.userid
            && this.isSbyConfirmed === "0" && this.pageType === "1"
            && this.$userPerssion.bzzPermission()) {
          this.isDisabled = true;
          this.submitFeedbackButtonVisitable = false;
          this.revokeFeedbackButtonVisitable = false;
          this.bzzConfirmButtonVisitable = false;
          this.bzzRevokeConfirmButtonVisitable = true;
          this.sbyConfirmButtonVisitable = false;
          this.sbyRevokeConfirmButtonVisitable = false;
        }
        // 设备员确认
        if (this.isBzzConfirmed === "1" && this.isSbyConfirmed === "0"
            && this.pageType === "2" && this.$userPerssion.sbkPermission()) {
          this.isDisabled = true;
          this.submitFeedbackButtonVisitable = false;
          this.revokeFeedbackButtonVisitable = false;
          this.bzzConfirmButtonVisitable = false;
          this.bzzRevokeConfirmButtonVisitable = false;
          this.sbyConfirmButtonVisitable = true;
          this.sbyRevokeConfirmButtonVisitable = false;
        }
        // 设备员撤销确认
        if (this.isSbyConfirmed === "1" && this.sbyConfirmBy === this.userid
            && this.pageType === "2" && this.$userPerssion.sbkPermission()) {
          this.isDisabled = true;
          this.submitFeedbackButtonVisitable = false;
          this.revokeFeedbackButtonVisitable = false;
          this.bzzConfirmButtonVisitable = false;
          this.bzzRevokeConfirmButtonVisitable = false;
          this.sbyConfirmButtonVisitable = false;
          this.sbyRevokeConfirmButtonVisitable = true;
        }
        //当前日期点检状态字段
        if(this.isSpotChecked === '0'){
          this.currentStatus = "点检未开始";
        }
        if(this.isSpotChecked === '1' && this.isBzzConfirmed === '0'){
          this.currentStatus = "点检已反馈";
        }
        if(this.isBzzConfirmed === '1' && this.isSbyConfirmed === '0'){
          this.currentStatus = "班组长已确认";
        }
        if(this.isSbyConfirmed === '1' ){
          this.currentStatus = "设备员已审核";
        }
      })
    },

    // 选择检查结果
    onOptionSelect(key, id, whethernormal) {
      //只读状态
      if (this.isDisabled) {
        return 0;
      }
      //找到操作字段并赋值
      const index = this.checkDetailTwoCycleList[key].findIndex((item) => item.id === id);
      if (index > -1) {
        this.checkDetailTwoCycleList[key][index].whethernormal = whethernormal;
      }
      //如果选择良好，需要把异常三项清空
      //if (whethernormal === '1'){
        this.checkDetailTwoCycleList[key][index].abnormaldescription = "";
        this.checkDetailTwoCycleList[key][index].abnormalreason = "";
        this.checkDetailTwoCycleList[key][index].abnormaltype = "";
      //}
      // console.log('checkDetailTwoCycleList',this.checkDetailTwoCycleList);
    },

    // 异常描述输入赋值
    // onDescriptionInput(e) {
    //   const {id} = e.currentTarget.dataset;
    //   const {value} = e.detail;
    //   const index = this.checkItems.findIndex((item) => item.id === id);
    //   if (index > -1) {
    //     this.checkItems[index].description = value;
    //   }
    // },

    /* // 选择图片
     chooseImage(itemId) {
       const item = this.checkItems.find(item => item.id === itemId);
       if (!item) return;

       const maxCount = 3 - (item.images?.length || 0);
       uni.chooseImage({
         count: maxCount,
         sizeType: ['compressed'],
         sourceType: ['album', 'camera'],
         success: (res) => {
           if (!item.images) {
             this.$set(item, 'images', []);
           }
           item.images.push(...res.tempFilePaths);
         }
       });
     },

     // 预览图片
     previewImage(urls, current) {
       uni.previewImage({
         urls: urls,
         current: urls[current]
       });
     },

     // 删除图片
     deleteImage(itemId, imageIndex) {
       const item = this.checkItems.find(item => item.id === itemId);
       if (item && item.images) {
         item.images.splice(imageIndex, 1);
       }
     },

     // 备注信息输入
     onRemarksInput(e) {
       this.remarks = e.detail.value;
     },*/

    // 提交保养反馈
    async submitFeedback() {
      let result = 0;
      for (const key in this.checkDetailTwoCycleList) {
        this.checkDetailTwoCycleList[key].forEach(item => {
          if (this.$commonUnits.stringIsBlank(item.whethernormal)) {
            uni.showToast({
              title: '请填写所有检查项结果',
              icon: 'none'
            });
            result = 1;
          } else if (item.whethernormal !== '1' && this.$commonUnits.stringIsBlank(item.abnormalreason)) {
            uni.showToast({
              title: '异常点检项目，至少填写异常原因',
              icon: 'none'
            });
            result = 1;
          }
        })
      }
      //报错直接返回，不调用接口了
      if (result === 1) {
        return 0;
      } else {
        if(await this.confirmUserPic()){
          this.isDoubleClickDisabled = true;
          //执行代码块
          uni.showLoading({
            title: '提交中...'
          });
          //处理数据，为后端提供便利
          for (const key in this.checkDetailTwoCycleList) {
            this.checkDetailTwoCycleList[key].forEach(item => {
              this.submitData.push(item);
            })
          }
          this.submitYear = dayjs(this.spotCheckDate).format('YYYY');
          this.submitMonth = dayjs(this.spotCheckDate).format('M');
          this.submitStatus = "已处理";
          this.submitWeek = this.$commonUnits.convertWeekDayToChinese(dayjs(this.spotCheckDate).format('d'));
          // console.log('提交数据：', this.submitData);
          //调用后端提交接口
          this.$commonUnits.postRequest("sbby.spotcheckmobilebiz.submitSpotCheckDetail.mobile",
              {
                userid: this.userid,
                sbid: this.sbid,
                checkdate: dayjs(this.spotCheckDate).format('YYYY-MM-DD'),
                year: this.submitYear,
                month: this.submitMonth,
                status: this.submitStatus,
                weekday: this.submitWeek,
                details: this.submitData,
              }).then(item => {
            // 模拟提交接口
            uni.hideLoading();
            if(item.res===2){
              uni.showToast({
                title: '日期已经存在点检记录，请勿重复提交。',
                icon: 'error',
                duration: 2000,
                success: () => {
                }
              });
            }
            if(item.res===1){
              uni.showToast({
                title: '提交成功',
                icon: 'success',
                duration: 2000,
                success: () => {
                  // 延迟返回上一页
                  setTimeout(() => {
                    // 修改一下列表
                    // uni.$emit('getListData');
                    this.isDoubleClickDisabled = false;
                    uni.navigateBack();
                  }, 2000);
                }
              });
            }
          })
        }
      }
    },
    //撤销点检员反馈
    revokeFeedback(){
      this.isDoubleClickDisabled = true;
      uni.showModal({
        title: '确认撤销反馈？',
        placeholderText: '请填写撤销原因',
        editable: true,
        success: (res) => {
          if (res.confirm) {
            this.$commonUnits.postRequest("sbby.spotcheckmobilebiz.revokeSpotCheck.mobile",{
              id:this.checkPlanId,
              remarks:res.content
            }).then(item=>{
              uni.showToast({
                title: '撤回成功',
                icon: 'success',
                duration: 2000,
                success: () => {
                  // 延迟返回上一页
                  setTimeout(() => {
                    // 刷新一下列表
                    this.isDoubleClickDisabled = false;
                    uni.navigateBack();
                  }, 2000);
                }
              });
            })
          }
          else if (res.cancel) {
            //防抖关闭
            this.isDoubleClickDisabled = false;
          }
        },
      });


    },
    //提交班组长确认
    async submitBzzConfirm(){
      if(await this.confirmUserPic()){
        this.isDoubleClickDisabled = true;
        this.$commonUnits.postRequest("sbby.spotcheckmobilebiz.bzzSpotCheckConfirm.mobile",{
          id:this.checkPlanId,
          userid:this.userid,
        }).then(item=>{
          uni.showToast({
            title: '确认成功',
            icon: 'success',
            duration: 2000,
            success: () => {
              // 延迟返回上一页
              setTimeout(() => {
                // 刷新一下列表,隐藏列表上的一键确认按钮
                uni.$emit('getListData',{quickConfirmFlag :0,plandateid:this.checkPlanId});
                this.isDoubleClickDisabled = false;
                uni.navigateBack();
              }, 2000);
            }
          });
        })
      }

    },
    //撤销班组长确认
    revokeBzzConfirm(){
      this.isDoubleClickDisabled = true;
      uni.showModal({
        title: '确认撤销班组长审核？',
        placeholderText: '请填写撤销原因',
        editable: true,
        success: (res) => {
          if (res.confirm) {
            this.$commonUnits.postRequest("sbby.spotcheckmobilebiz.bzzSpotCheckRevoke.mobile",{
              id:this.checkPlanId,
              remarks:res.content
            }).then(item=>{
              uni.showToast({
                title: '确认撤销成功',
                icon: 'success',
                duration: 2000,
                success: () => {
                  // 延迟返回上一页
                  setTimeout(() => {
                    // 刷新一下列表
                    uni.$emit('getListData',{quickConfirmFlag :1,plandateid:this.checkPlanId});
                    this.isDoubleClickDisabled = false;
                    uni.navigateBack();
                  }, 2000);
                }
              });
            })
          }
          else if (res.cancel) {
            //防抖关闭
            this.isDoubleClickDisabled = false;
          }
        },
      });

    },
    //设备员确认
    async submitSbyConfirm(){
      if( await this.confirmUserPic()){
        this.isDoubleClickDisabled = true;
        this.$commonUnits.postRequest("sbby.spotcheckmobilebiz.sbySpotCheckConfirm.mobile",{
          id:this.checkPlanId,
          userid:this.userid,
        }).then(item=>{
          uni.showToast({
            title: '审核成功',
            icon: 'success',
            duration: 2000,
            success: () => {
              // 延迟返回上一页
              setTimeout(() => {
                // 刷新一下列表
                uni.$emit('getListData',{quickConfirmFlag :0,plandateid:this.checkPlanId});
                this.isDoubleClickDisabled = false;
                uni.navigateBack();
              }, 2000);
            }
          });
        })
      }
    },
    //撤销设备员反馈
    revokeSbyConfirm(){
      this.isDoubleClickDisabled = true;
      uni.showModal({
        title: '确认撤销设备员审核？',
        placeholderText: '请填写撤销原因',
        editable: true,
        success: (res) => {
          if (res.confirm) {
            this.$commonUnits.postRequest("sbby.spotcheckmobilebiz.sbySpotCheckRevoke.mobile",{
              id:this.checkPlanId,
              remarks:res.content
            }).then(item=>{
              uni.showToast({
                title: '审核撤销成功',
                icon: 'success',
                duration: 2000,
                success: () => {
                  // 延迟返回上一页
                  setTimeout(() => {
                    // 刷新一下列表
                    uni.$emit('getListData',{quickConfirmFlag :1,plandateid:this.checkPlanId});
                    this.isDoubleClickDisabled = false;
                    uni.navigateBack();
                  }, 2000);
                }
              });
            })
          }
          else if (res.cancel) {
            //防抖关闭
            this.isDoubleClickDisabled = false;
          }
        },
      });
    },

    //提交前确认当前登录用户有无数字签名
    async confirmUserPic(){
      var userPic = '';
      //调用接口获取用户数字签名
      await this.$commonUnits.postRequest('sbby.userinformationbiz.getUserPicFilePathByUserId.mobile',{userid:this.userid}).then(item=>{
        //将 当前用户的数字签名 保存到 user_pic
        userPic = item.res.FILE_PATH;
      })
      if (this.$commonUnits.isBankStr(userPic)){
         uni.showToast({
          title: '用户未配置签名',
          icon: 'error',
          duration: 2000,
          success: () => {}
        });
         return false;
      }
      return true;
    }
  },
  watch: {
    //日期变化后
    spotCheckDate:{
      handler(newValue,oldValue){
          this.getSpotDetailList();
      }
    }
  }
};
</script>

<style scoped>

picker {
  flex: 1;
  margin: 0 5px;
  max-width: 30%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.custom-picker {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 12px;
  border: 1px solid #dcdfe6;
  border-radius: 6px;
  background-color: #f7f7f7;
  color: #606266;
  font-size: 14px;
  transition: all 0.3s;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}


.custom-picker-text {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 8px;
}

/* 下拉箭头样式 */
.arrow-icon {
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #909399;
  margin-left: -5px;
  transition: transform 0.3s;
}
.container {
  min-height: 100vh;
  background: #f5f7fa;
  padding-bottom: 120rpx;
}

.form-section {
  padding: 20rpx;
}

.form-group {
  background: #ffffff;
  border-radius: 12rpx;
  padding: 24rpx;
  margin-bottom: 20rpx;
}

.form-title {
  font-size: 28rpx;
  font-weight: 500;
  color: #333;
  margin-bottom: 20rpx;
  border-left: 4rpx solid #1890ff;
  padding-left: 12rpx;
}

.form-item {
  display: flex;
  align-items: center;
  padding: 16rpx 0;
  border-bottom: 1rpx solid #f0f0f0;
}

.form-item:last-child {
  border-bottom: none;
}

.label {
  min-width: 160rpx;
  color: #666;
  font-size: 26rpx;
}

.value {
  flex: 1;
  color: #333;
  font-size: 26rpx;
}

/* 检查项目样式 */
.check-list {
  margin-top: 10rpx;
}

.check-item {
  padding: 20rpx 0;
  border-bottom: 1rpx solid #f0f0f0;
}

.check-item:last-child {
  border-bottom: none;
}

.check-header {
  display: flex;
  align-items: center;
  margin-bottom: 16rpx;
}

.check-name {
  font-size: 26rpx;
  color: #333;
}

.check-required {
  color: #ff4d4f;
  margin-left: 8rpx;
}

.check-options {
  display: flex;
  padding: 0 10rpx;
  gap: 10rpx;
  overflow-x: auto
}

.option {
  flex: 1;
  height: 50rpx;
  min-width: 110rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1rpx solid #d9d9d9;
  border-radius: 6rpx;
  font-size: 20rpx;
  color: #666;
  box-sizing: border-box;
  padding: 0 10rpx;
}

.option.active {
  background: #e6f7ff;
  border-color: #1890ff;
  color: #1890ff;
}

.abnormal-desc {
  margin-top: 16rpx;
  width: 100%;
  height: 120rpx;
  padding: 16rpx;
  box-sizing: border-box;
  border: 1rpx solid #d9d9d9;
  border-radius: 6rpx;
  font-size: 26rpx;
  color: #333;
}

/* 图片上传区域样式 */
.image-list {
  display: flex;
  flex-wrap: wrap;
  gap: 16rpx;
}

.image-item {
  width: 160rpx;
  height: 160rpx;
  position: relative;
}

.image-item image {
  width: 100%;
  height: 100%;
  border-radius: 6rpx;
}

.delete-btn {
  position: absolute;
  right: -10rpx;
  top: -10rpx;
  width: 40rpx;
  height: 40rpx;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32rpx;
}

.upload-btn {
  width: 160rpx;
  height: 160rpx;
  border: 1rpx dashed #d9d9d9;
  border-radius: 6rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #999;
}

.plus {
  font-size: 48rpx;
  margin-bottom: 8rpx;
}

.upload-text {
  font-size: 24rpx;
}

/* 备注信息样式 */
.remarks {
  width: 100%;
  height: 160rpx;
  padding: 16rpx;
  box-sizing: border-box;
  border: 1rpx solid #d9d9d9;
  border-radius: 6rpx;
  font-size: 26rpx;
  color: #333;
}

/* 在现有样式基础上添加 */
.form-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20rpx;
}

.quick-action {
  display: flex;
  align-items: center;
  padding: 8rpx 16rpx;
  background: #f6ffed;
  border-radius: 4rpx;
  border: 1rpx solid #52c41a;
  cursor: pointer;
}

.quick-action.is-marked {
  background: #fff1f0;
  border-color: #ff4d4f;
}

.action-text {
  font-size: 24rpx;
  color: #52c41a;
}

.quick-action.is-marked .action-text {
  color: #ff4d4f;
}


.action-icon {
  width: 32rpx;
  height: 32rpx;
  margin-right: 8rpx;
}

/* 图片上传样式 */
.upload-images {
  margin-top: 20rpx;
}

.upload-btn {
  width: 160rpx;
  height: 160rpx;
  background: #fafafa;
  border: 1rpx dashed #d9d9d9;
  border-radius: 8rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.upload-icon {
  font-size: 40rpx;
  color: #999;
  line-height: 1;
  margin-bottom: 4rpx;
}

.upload-text {
  font-size: 24rpx;
  color: #999;
}

.upload-desc {
  font-size: 20rpx;
  color: #999;
  margin-top: 4rpx;
}

.image-list {
  display: flex;
  flex-wrap: wrap;
  gap: 16rpx;
  margin-top: 16rpx;
}

.image-item {
  position: relative;
  width: 160rpx;
  height: 160rpx;
}

.image-item image {
  width: 100%;
  height: 100%;
  border-radius: 8rpx;
}

.delete-btn {
  position: absolute;
  top: -16rpx;
  right: -16rpx;
  width: 32rpx;
  height: 32rpx;
  line-height: 32rpx;
  text-align: center;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  border-radius: 50%;
  font-size: 24rpx;
}

/* 异常内容区域样式 */
.abnormal-content {
  margin-top: 16rpx;
}

.upload-images {
  margin-top: 16rpx;
}

.image-list {
  display: flex;
  flex-wrap: wrap;
  gap: 16rpx;
}

.image-item {
  position: relative;
  width: 160rpx;
  height: 160rpx;
}

.image-item image {
  width: 100%;
  height: 100%;
  border-radius: 8rpx;
}

.delete-btn {
  position: absolute;
  top: -16rpx;
  right: -16rpx;
  width: 32rpx;
  height: 32rpx;
  line-height: 32rpx;
  text-align: center;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  border-radius: 50%;
  font-size: 24rpx;
}

.upload-btn {
  width: 160rpx;
  height: 160rpx;
  background: #fafafa;
  border: 1rpx dashed #d9d9d9;
  border-radius: 8rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.upload-icon {
  font-size: 40rpx;
  color: #999;
  line-height: 1;
  margin-bottom: 4rpx;
}

.upload-text {
  font-size: 24rpx;
  color: #999;
}

.upload-desc {
  font-size: 20rpx;
  color: #999;
  margin-top: 4rpx;
}

.lock-text {
  font-size: 32rpx;
  color: #ff4d4f;
  transform: rotate(-15deg);
  background: rgba(0, 0, 0, 0.6);
  padding: 16rpx 32rpx;
  border-radius: 8rpx;
  color: #fff;
}


/* 底部提交按钮固定定位 */
.footer-submit {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0);
  padding: 20rpx 30rpx;
  z-index: 999;
}

/* 让页面内容不被底部按钮遮挡 */
.container {
  padding-bottom: 160rpx; /* 根据按钮高度调整 */
}

/* 按钮样式调整 */
.footer-submit button {
  width: 100%;
  height: 80rpx;
  line-height: 80rpx;
  font-size: 32rpx;
  margin: 10rpx 0;
  background: #252b93;
  color: #fff;
  border-radius: 8rpx;
}

.footer-submit button[disabled] {
  background: #ccc;
}

/* 在原有样式基础上添加 */
/deep/ .up-datetime-picker__input {
  border: none !important;
  background-color: transparent !important;
  font-size: 26rpx !important;
  color: #333 !important;
  padding: 0 !important;
  height: auto !important;
  line-height: 1.5 !important;
}

/* 调整输入框整体容器 */
/deep/ .up-datetime-picker {
  flex: 1;
  margin: 0;
  padding: 0;
}

/* 调整placeholder样式 */
/deep/ .up-datetime-picker__input::placeholder {
  color: #999 !important;
  font-size: 26rpx !important;
}

/* 禁用状态样式 */
/deep/ .up-datetime-picker.disabled .up-datetime-picker__input {
  color: #333 !important; /* 保持与正常状态一致 */
  opacity: 1 !important;
}

/* 日期图标样式（如果存在） */
/deep/ .up-datetime-picker__icon {
  font-size: 28rpx !important;
  color: #666 !important;
  margin-left: 10rpx;
}


.date-picker-text {
  display: flex;
  align-items: center;
  font-size: 26rpx;
  color: #666;
}

.picker-arrow {
  margin-left: 8rpx;
  transform: rotate(90deg);
  color: #999;
}

.footer-submit .revoke {
  width: 100%;
  height: 80rpx;
  line-height: 80rpx;
  font-size: 32rpx;
  margin: 10rpx 0;
  background: #ff0000;
  color: #fff;
  border-radius: 8rpx;
}

</style>